<template>
	<view class="my">
		<!-- 积分抽奖 -->
		<view class="lottery-box" @click="goLottery">
			<image class="lottery-img" src="https://biapi.vaubang.cn/UploadFiles/Images/lottery-img.png"
				mode="widthFix"></image>
		</view>

		<view class="avatar-nickname-box">
			<view class="avatar-box" @click="handleEditInfo()">
				<!-- <image class="avatar" :src="userInfo.avatarUrl" mode="aspectFit" v-if="userInfo.avatarUrl"></image> -->
				<image class="avatar" :src="tokenInfo.avatar" mode="aspectFit"
					v-if="tokenInfo.avatar != '0' && tokenInfo.avatar == ''"></image>
				<image class="avatar" src="../../static/logo.jpg" mode="aspectFit" v-else></image>
			</view>
			<view class="nickname-box">
				<view>
					<view class="role-realname-box">
						<view class="role-realname-text">
							{{tokenInfo.roleNames ? tokenInfo.roleNames : ""}}-{{ tokenInfo.realName ? tokenInfo.realName : ""}}
						</view>
					</view>
					<view class="shopid-shopname-box">
						{{tokenInfo.shopId ? tokenInfo.shopId : ""}}-{{tokenInfo.shopName ? tokenInfo.shopName : ""}}
					</view>
				</view>


				<view class="sign-btn" @click.stop="onSign('unSign')" v-if="!isTodaySign">
					<van-icon class="sign-icon" name="certificate" />
					<text>签到</text>
				</view>
				<view class="sign-btn already-sign" @click.stop="onSign('sign')" v-else>
					<van-icon class="sign-icon" name="certificate" />
					<text>今日已签到</text>
				</view>
			</view>


		</view>

		<view class="registed-box">
			<view class="registed-text">
				<view class="top-text">邀请用户注册</view>
				<view class="bottom-text">分享至微信，一键邀请用户注册门店账号</view>
			</view>
			<button class="right-registed-btn" open-type="share">
				立即邀请
			</button>
		</view>

		<view class="list">
			<uni-list :border="false">
				<uni-list-item :show-extra-icon="true" :extra-icon="{
					color: '#008aff',
					size: '20',
					type: 'person'
				}" showArrow title="个人信息修改" clickable @click="handleEditInfo" />
				<uni-list-item :show-extra-icon="true" :extra-icon="{
					color: '#F5B63F',
					size: '20',
					type: 'medal'
				}" showArrow title="我的积分" clickable @click="handleIntegral" />
				<uni-list-item :show-extra-icon="true" :extra-icon="{
					color: '#66C6C6',
					size: '20',
					type: 'image'
				}" showArrow title="点检报表" clickable @click="handleKPI" />
				<uni-list-item :show-extra-icon="true" :extra-icon="{
					color: '#008aff',
					size: '20',
					type: 'help'
				}" showArrow title="意见反馈" rightText="使用有问题？来这里沟通" clickable @click="handleFeedback" />
				<uni-list-item :show-extra-icon="true" :extra-icon="{
					color: '#66C6C6',
					size: '20',
					type: 'tune'
				}" showArrow title="切换门店" clickable @click="handleToggleShop" />
			</uni-list>
		</view>
	</view>
</template>

<script>
	import getDateTime from '@/common/getDateTime.js';
	import apiRqs from "@/api/api-request.js";
	export default {
		data() {
			return {
				userInfo: {},
				tokenInfo: {},
				userInfoShow: false,
				showRight: false,
				userLoading: false,
				isTodaySign: false,
			}
		},
		onShow() {
			this.handleAnalysisToken();
		},
		onLoad() {
			const userInfo = uni.getStorageSync("userInfo");
			if (userInfo) {
				this.userInfo = userInfo;
				this.userInfoShow = true;
			} else {
				this.userInfoShow = false;
			}
			getApp().showLoading();
			// this.handleAnalysisToken();
			this.getUserInfo();
			this.handleGetWeekSignList();
		},
		onShareAppMessage() {
			return this.getShareData();
		},
		methods: {
			// 进入积分抽奖入口
			goLottery() {
				uni.navigateTo({
					url: "/packageA/workbench/integral-lottery"
				})
			},
			handleEditInfo() {
				uni.navigateTo({
					url: '/packageC/my/edit-info'
				})
			},
			handleKPI() {
				uni.navigateTo({
					url: "/packageC/my/record-kpi"
				})
				// getApp().showToast("功能开发中，敬请期待！");
			},
			handleFeedback() {
				uni.navigateTo({
					url: "/packageC/my/create-feedback"
				})
			},
			handleIntegral() {
				uni.navigateTo({
					url: "/packageA/workbench/sign-detail"
				})
			},
			onSign(type) {
				if (type == 'unSign') {
					var that = this;
					getApp().showLoading();
					apiRqs._handleSign().then((res) => {
						uni.hideLoading();
						console.log('今日签到结果', res);
						if (res.code == 200) {
							getApp().showToast('签到成功');
							setTimeout(() => {
								uni.navigateTo({
									url: "/packageA/workbench/sign-detail"
								})
							}, 1000)
						} else {
							getApp().showToast(res.msg);
						}
					})
				} else {
					uni.navigateTo({
						url: "/packageA/workbench/sign-detail"
					})
				}

			},
			// 获取本周签到情况
			handleGetWeekSignList() {
				let currentDay = getDateTime.getDay(0);
				apiRqs._getCurrentWeekSignDetail().then((res) => {
					console.log('本周签到情况', res);
					if (res.code == 200) {
						let newData = JSON.parse(JSON.stringify(res.data));
						for (let i = 0; i < newData.length; i++) {
							if (currentDay == newData[i].signInDate) {
								if (newData[i].isSignIn == 1) {
									this.isTodaySign = true;
								} else {
									this.isTodaySign = false;
								}
							}
						}
					}
				})
			},
			getUserInfo() {
				var that = this;
				// 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
				// 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
				uni.getUserProfile({
					desc: '用于完善用户资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					async success(res) {
						console.log('用户信息', res);
						uni.setStorageSync("userInfo", res.userInfo);
						that.userInfo = res.userInfo;
						getApp().globalData.userInfo = res.userInfo;
						that.userInfoShow = true;
					},
					fail: (err) => {
						console.log('拒绝...', err);
					}
				})
			},
			// 分享给好友
			getShareData() {
				const tokenInfo = uni.getStorageSync("tokenInfo");
				const loginInfo = uni.getStorageSync("loginInfo");
				let code = "";
				if (loginInfo && loginInfo.companys.length > 0) {
					for (let i = 0; i < loginInfo.companys.length; i++) {
						if (tokenInfo.shopId == loginInfo.companys[i].shopId) {
							code = loginInfo.companys[i].invitationCode;
						}
					}
				}
				console.log(tokenInfo.shopId, code);
				let title = `邀请您注册${tokenInfo.shopName}的账号`;
				let imageUrl = "https://biapi.vaubang.cn/UploadFiles/Images/replace/index-share-2.png";
				// 判断本地是否存在ID---------（这个不重要，目的是为了获取 path）
				if (tokenInfo) {
					let shopid = tokenInfo.shopId;
					let path = `/packageA/bind/bind?shopid=${tokenInfo.shopId}&code=${code}&isShare=true`;
					return {
						title,
						imageUrl,
						path,
					};
				} else {
					let path = '/pages/workbench/workbench';
					return {
						title,
						imageUrl,
						path,
					};
				}

			},
			handleToggleShop() {
				uni.navigateTo({
					url: "/packageC/my/toggle-shop"
				})
			},
			// 解析token
			handleAnalysisToken() {
				var that = this;
				// that.userLoading = true;
				uni.login({
					provider: "weixin",
					success(loginRes) {
						console.log(loginRes);
						let code = loginRes.code;
						uni.request({
							url: "https://bydapi.vaubang.cn/api/v1/WxOpen/Login?code=" +
								code,
							method: "post",
							header: {
								"content-type": "application/json;charset=utf-8;"
							},
							success(res) {
								// 当登录者已经绑定了openid时，直接保存登录信息返回的token以及公司信息
								if (res.data.code == 200) {
									uni.setStorageSync("isLogin", true);
									uni.setStorageSync('loginInfo', res.data
										.data);
									getApp().globalData.loginInfo = res.data
										.data;
									let loginInfo = res.data.data;
									if (loginInfo && loginInfo.token) {

										uni.request({
											url: "https://bydapi.vaubang.cn/api/v1/WxOpen/GetTokenInfo",
											method: "post",
											header: {
												"content-type": "application/json;charset=utf-8;",
												'Authorization': 'Bearer ' + loginInfo.token
											},
											success(res) {
												uni.hideLoading();
												console.log('解析token', res.data.data);
												if (res.data.code == 200 && res.data.data !=
													null) {
													const oldTokenAvatar = uni.getStorageSync(
														"tokenInfo").avatar;
													if (oldTokenAvatar) {
														res.data.data.avatar = oldTokenAvatar;
													}
													uni.setStorageSync("tokenInfo", res.data.data);
													that.tokenInfo = res.data.data;
												}
											},
											fail(err) {
												console.log(err);
											}
										})
									}
								} else if (res.data.code == 210) {
									// that.userLoading = false;
									uni.hideLoading();
									uni.setStorageSync("isLogin", false);
									uni.setStorageSync("userData", res.data.data);
									uni.navigateTo({
										url: "/packageA/bind/bind"
									})
								} else {
									// that.userLoading = false;
									uni.hideLoading();
									getApp().showToast(res.data.msg);
								}
							},
							fail(err) {
								console.log(err);
							}
						})
					}
				})

			},
		},
	}
</script>

<style lang="less">
	page {
		background-color: #f5f5f5;
	}

	.my {
		.lottery-box {
			position: fixed;
			right: 10px;
			bottom: 50px;
			box-sizing: border-box;
			z-index: 99;
			animation: doudong 5s ease-in-out infinite;
			animation-direction: alternate;

			.lottery-img {
				width: 60px;
			}
		}

		.avatar-nickname-box {
			display: flex;
			align-items: center;
			margin: 30px 20px 0 20px;

			.avatar-box {
				width: 53px;
				flex: 0 0 53px;
				height: 53px;
				border-radius: 50%;

				.avatar {
					width: 53px;
					height: 53px;
					border-radius: 50%;
				}
			}

			.nickname-box {
				flex: 1;
				margin-left: 15px;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.sign-btn {
					padding: 5px 8px;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 4px;
					border: 1px solid #fff;
					font-size: 10px;
					color: #fff;
					background-color: #008aff;
					margin-left: 5px;

					.sign-icon {
						font-size: 16px;
						margin-right: 3px;
					}

					&:active {
						background-color: #0076DB;
					}

					&.already-sign {
						background: rgba(0, 138, 255, 0.6);
					}
				}

				.role-realname-box {
					display: flex;
					align-items: center;
					width: 300rpx;

					.role-realname-text {
						font-size: 15px;
						color: #000;
						font-weight: 500;
					}


				}

				.shopid-shopname-box {
					font-size: 11px;
					color: #9A9899;
					margin-top: 5px;
				}
			}
		}

		.registed-box {
			background-image: url("https://biapi.vaubang.cn/UploadFiles/Images/replace/my-resited-bg.png");
			background-size: cover;
			background-repeat: no-repeat;
			background-position: top left;
			width: calc(100% - 40px);
			height: 82px;
			margin: 20px 20px 0 20px;
			border-radius: 10px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 12px;
			box-sizing: border-box;

			.registed-text {
				.top-text {
					font-size: 17px;
					font-weight: 500;
					color: #fff;
				}

				.bottom-text {
					font-size: 11px;
					margin-top: 2px;
					color: rgba(255, 255, 255, 0.81);
				}
			}

			.right-registed-btn {
				width: 75px;
				height: 28px;
				text-align: center;
				line-height: 27px;
				border-radius: 40px;
				border: 1px solid #fff;
				font-size: 11px;
				color: #fff;
				background-color: transparent;
				margin: 0;
			}
		}

		.avatar-nickname-section {
			display: flex;
			flex-direction: column;
			align-items: center;
			margin-top: 20px;

			.name-shop-role-section {
				display: flex;
				flex-direction: column;
				align-items: center;
			}

			.avatar {
				width: 80px;
				height: 80px;
				border-radius: 3px;
			}

			.nickname {
				font-size: 16px;
				font-weight: bold;
				color: #000;
				margin-top: 6px;
			}

			.nickname-role {
				display: flex;
				align-items: center;
				margin-top: 6px;
				font-size: 12px;
				color: #999;

				.shop-name-text {
					margin-right: 12px;
				}

				.role-text {
					margin-right: 12px;
				}
			}
		}

		.list {
			margin: 20px;

			.uni-border-top {
				height: 0;
			}

			.uni-list {
				margin-top: 20px;
				border-radius: 8px;

				.uni-list-item {
					&:first-child {
						border-top-left-radius: 8px;
						border-top-right-radius: 8px;
					}

					&:last-child {
						border-bottom-left-radius: 8px;
						border-bottom-right-radius: 8px;
					}

					.uni-list-item__container {
						padding: 16px 15px;

						.uni-list-item__header {
							padding-top: 2px;
						}
					}
				}
			}
		}

		.registed-btn {
			position: fixed;
			bottom: 50px;
			left: 20px;
			right: 20px;
			border: none;
			background-color: #008aff;
			color: #fff;
			font-size: 15px;
			height: 35pt;
			line-height: 35pt;

			&:active {
				background-color: #007feb;
			}
		}

		.toggle-shop {
			position: fixed;
			bottom: 20px;
			left: 0;
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;

			.toggle-shop-text {
				font-size: 13px;
				color: #999999;
			}

			.registed-text {
				font-size: 13px;
				color: #999;
				margin-left: 20px;
			}
		}

	}

	@keyframes doudong {
		0% {
			transform: scale(1);
			transform: rotate(-8deg);
			/*开始为原始大小*/
		}

		25% {
			transform: scale(1.08);
			transform: rotate(8deg);
			/*放大1.1倍*/
		}

		50% {
			transform: scale(1);
			transform: rotate(-8deg);
		}

		75% {
			transform: scale(1.08);
			transform: rotate(8deg);
		}
	}
</style>